<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>永恒的主</title>
		<link rel="stylesheet" type="text/css" href="../css/global.css" />
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<script src="../js/vue.min.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body style="padding-top: 60px;">
		<h1>永恒的主</h1>
			<div align="center">
				<audio id="audio" controls
					src="https://vichien-public.oss-cn-guangzhou.aliyuncs.com/DISI%20App/%E3%80%8A%E6%B0%B8%E6%81%92%E7%9A%84%E4%B8%BB%E3%80%8B.mp3"></audio>
			</div>
			<div id="lyc">
				<div align="center" id="music_pages_btn">
					<button @click="turn_type1()">歌词</button>
					<button @click="turn_type2()">歌谱</button>
				</div>
				<hr>
				<!-- <h5>歌词</h5> -->
				<div align="center">
					<div id="lyric" v-show="type==='1'">
						全能创造真神
									<br>祢是我的天父
									<br>天地未造以先 
									<br>惟独祢是主
									<br>祢是我的居所 
									<br>永恒生命归宿
									<br>昨日今日明日 
									<br>祢必看顾保护
									<br>扬声赞美主 
									<br>同心高举主
									<br>愿祢掌权作王 
									<br>愿祢国度降临
									<br>扬声赞美主 
									<br>同心高举主 哈利路亚
									<br>超越时空主宰 
									<br>开启我的眼目
									<br>人生春夏秋冬
									<br>终必归尘土
									<br>仿佛早晨嫩芽 
									<br>夜晚凋零干枯
									<br>求祢耐心教我 
									<br>人生日子细数
									<br>扬声赞美主 
									<br>同心高举主
									<br>愿祢掌权作王 
									<br>愿祢国度降临
									<br>扬声赞美主
									<br>同心高举主 哈利路亚
									<br>我们度尽年日 
									<br>充满叹息劳苦
									<br>怜我罪恶本性 
									<br>惹动主忿怒
									<br>离弃生命源头 
									<br>不愿向主顺服
									<br>矜夸一生忙碌 
									<br>踏上灭亡道路
									<br>扬声赞美主 同心高举主
									<br>扬声赞美主 同心高举主
									<br>扬声赞美主 
									<br>同心高举主
									<br>愿祢掌权作王 
									<br>愿祢国度降临
									<br>扬声赞美主
									<br>同心高举主 哈利路亚
									<br>世上万民万族
									<br>应当向祢俯伏
									<br>学习敬畏等候
									<br>静听主吩咐
									<br>悠悠遭难岁月 
									<br>加倍丰盈祝福
									<br>饱尝祢的慈爱 
									<br>一生喜乐欢呼
									<br>扬声赞美主 
									<br>同心高举主
									<br>愿祢掌权作王 
									<br>愿祢国度降临
									<br>扬声赞美主
									<br>同心高举主 哈利路亚
									<br>扬声赞美主 
									<br>同心高举主
									<br>愿祢掌权作王 
									<br>愿祢国度降临
									<br>扬声赞美主
									<br>同心高举主 
									<br>哈利路亚 哈利路亚
					</div>
				</div>
				<!-- 歌谱轮播图 -->
				<div align="center">
					<div id="staff" v-show="type==='2'">
						<img src="https://vichien-public.oss-cn-guangzhou.aliyuncs.com/DISI%20App/%E6%AD%8C%E8%B0%B1/1-1-004%20%E6%B0%B8%E6%81%92%E7%9A%84%E4%B8%BB/%E6%B0%B8%E6%81%92%E7%9A%84%E4%B8%BBPage1%262.jpg" />
						<img src="https://vichien-public.oss-cn-guangzhou.aliyuncs.com/DISI%20App/%E6%AD%8C%E8%B0%B1/1-1-004%20%E6%B0%B8%E6%81%92%E7%9A%84%E4%B8%BB/%E6%B0%B8%E6%81%92%E7%9A%84%E4%B8%BBPage3%264.jpg" />
						<div class="line"></div>
					</div>
				</div>
				<div align="center">
					<h6 style="color:rgba(40, 44, 53,0.4)">----上拉查看完整歌词或歌谱----</h6>
				<h6 style="color: rgba(40, 44, 53,0.7); margin-top: -8px;">歌 谱 原 图「长按」保 存</h6>

				</div>
			</div>
		</body>
		<script type="text/javascript">
			var vm = new Vue({
				el: "#lyc",
				data: {
					type: "1"
				},
				methods:{
					turn_type1(){
						vm.type='1'
					},
					turn_type2(){
						vm.type='2'
					}
				}
			})
		</script>
</html>
